<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="./css/jingdong.css">
    <title>Document</title>
</head>

<body>
    <ul id="max">
        <li id="top">京东秒杀倒计时</li>
        <li id="mini">
            <span id="span1"></span>
            <span id="span2"></span>
            <span id="span3"></span>
            <span id="span4"></span>
        </li>
    </ul>
</body>

</html>
<script>
    //获取元素
    let span1 = document.getElementById('span1')
    let span2 = document.getElementById('span2')
    let span3 = document.getElementById('span3')
    let span4 = document.getElementById('span4')
    //函数封装
    function fun() {
        //获取当前时间的总毫秒数
        let ing=new Date().getTime()
        // console.log(ing);
        //获取将来时间的总毫秒数
        let future=+new Date('2022/10/31')
        // console.log(future)
        //获取时间差
        let gap=future-ing
        // console.log(gap)
        //进行时间的换算
        let day=parseInt(gap/1000/60/60/24)  //天
        //如果时间小于10在前面补0
        let dayValue=day<10?'0'+day:day;
        this.span1.innerHTML=dayValue+'天'

        let time=parseInt(gap/1000/60/60%24)  //时
        // console.log(time)
        //如果时间小于10在前面补0
        let timeValue=time<10?'0'+time:time;
        this.span2.innerHTML=timeValue+'时'

        let minute=parseInt(gap/1000/60%60)  //分
        // console.log(minute)
        //如果时间小于10在前面补0
        let minuteValue=minute<10?'0'+minute:minute;
        this.span3.innerHTML=minuteValue+'分'

        let second=parseInt(gap/1000%60)  //秒
        // console.log(second)
        //如果时间小于10在前面补0
        let secondValue=second<10?'0'+second:second;
        this.span4.innerHTML=secondValue+'秒'
    }
    setInterval(()=>{
        fun()
    })
   
</script>